<template lang="">
  <div>

    <el-steps :active="active" finish-status="success">
      <el-step title="商品信息" />
      <el-step title="商品详情" />
      <el-step title="其他设置" />
      <el-step title="规格设置" />
    </el-steps>
    <div class="box">
      <ul>
        <li><span>排序:</span><el-input-number v-model="num1" /></li>
        <li><span>积分:</span><el-input-number v-model="num2" /></li>
        <li><span>虚拟销售:</span><el-input-number v-model="num3" /></li>
      </ul>
    </div>
    <el-button style="margin-top: 12px;" @click="next">下一步</el-button>
  </div>
</template>
<style lang="scss">
.box {
  ul {
    display: flex;
    justify-content: space-around;
    li {
      display: block;
      span {
        font-size: 20px;
      }
    }
  }
}
</style>
<script>
export default {
  data() {
    return {
      num1: 1,
      num2: 1,
      num3: 1,
      num4: 1,
      active: 0
    }
  },

  methods: {
    next() {
      if (this.active++ > 2) this.active = 0
      this.$router.push('/shop/single')
    },
    last() {
      if (this.active-- < 1) this.active = 0
    }
  }
}
</script>
